<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" import="com.zzty.springmybatis.entity.User"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet"
	href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
<script
	src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script
	src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ZZTY</title>
<!-- BOOTSTRAP STYLES-->
<link href="../css/bootstrap.css" rel="stylesheet" />

<!-- CUSTOM STYLES-->
<link href="../css/custom.css" rel="stylesheet" />
</head>
<style type="text/css">
h1 {
	font-family: "微软雅黑";
	font-size: 40px;
	margin: 20px 0;
	border-bottom: solid 1px #ccc;
	padding-bottom: 20px;
	letter-spacing: 2px;
}

.time-item strong {
	background: #C71C60;
	color: #fff;
	line-height: 49px;
	font-size: 36px;
	font-family: Arial;
	padding: 0 10px;
	margin-right: 10px;
	border-radius: 5px;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

#day_show {
	float: left;
	line-height: 49px;
	color: #c71c60;
	font-size: 32px;
	margin: 0 10px;
	font-family: Arial, Helvetica, sans-serif;
}

.item-title .unit {
	background: none;
	line-height: 49px;
	font-size: 24px;
	padding: 0 10px;
	float: left;
}
</style>
<script type="text/javascript">
	$(document).ready(function() {
		var flag = 0;

		function updateTotalTime(result) {
			if (result == "请勿重复提交") {
				flag = 1;
				alert(result);
			}
		}
		
		var intDiff = parseInt(5);//倒计时总秒数量
		function timer(intDiff){
		    window.setInterval(function(){
		    var day=0,
		        hour=0,
		        minute=0,
		        second=0;//时间默认值        
		    if(intDiff > 0){
		        day = Math.floor(intDiff / (60 * 60 * 24));
		        hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
		        minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
		        second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
		    }
		    if (minute <= 9) minute = '0' + minute;
		    if (second <= 9) second = '0' + second;
		    $('#day_show').html(day+"天");
		    $('#hour_show').html('<s id="h"></s>'+hour+'时');
		    $('#minute_show').html('<s></s>'+minute+'分');
		    $('#second_show').html('<s></s>'+second+'秒');
		    intDiff--;
		    }, 1000);
		} 
		function checkFile(str) {
			var pos = str.lastIndexOf('.zip');
			if (pos === -1) {
				return false;
			} else {
				return pos + 4 === str.length;
			}
		}
		
		
		
		
		
		function getTime() {
			var date = new Date().toLocaleString();
			$("#date").val(date);
			//document.getElementById("date").value = date;
		}
		setInterval(getTime, 0);

		$("#start").click(function() {
			$.ajax({
				type : "GET",
				url : "../SelfExamTransation/judge",

				contentType : "application/json",

				success : function(data) {
					
					if ("无法开始竞赛" == data) {
					
					alert(data);
					} else {
						$("#div1").hide();
						$("#div2").show();
// 						document.getElementById("div1").style.display = "none";
// 						document.getElementById("div2").style.display = "block";
						var obj = JSON.parse(data);
						var count = obj.countdown;
						intDiff =parseInt(count);
						$(function(){
						    timer(intDiff);
						}); 
// 						strs = count.split("_");
// 						$("#t_h").html(strs[0]);
// 						$("#t_m").html(strs[1]);
// 						$("#t_s").html(strs[2]);
// 						document.getElementById("t_h").innerHTML = strs[0];
// 						document.getElementById("t_m").innerHTML = strs[1];
// 						document.getElementById("t_s").innerHTML = strs[2];
// 						setInterval(refreshCount, 1000);
						var qstContent = obj.qstContent;
						$("#tarea1").val(qstContent);
// 						document.getElementById("tarea1").value = qstContent;

					}
				},
				error : function(data) {
					alert(data + "error");
				}
			})

		})
		function judgeUploadButton() {
		var tmp = document.getElementById("inputfile").value;

		if (document.getElementById("inputfile").value != "" && checkFile(tmp)) {
			document.getElementById("b1").value = "提交";
			document.getElementById("b1").disabled = "";
		} else {
			document.getElementById("b1").value = "请选择文件";
			document.getElementById("b1").disabled = "disabled";
		}
	}
	setInterval(judgeUploadButton, 0);
// 		function refreshCount() {
// 		if (document.getElementById("t_h").innerHTML == "已") {
// 			return;
// 		}
// 		var hour = document.getElementById("t_h").innerHTML.charAt(0);
// 		var minute = document.getElementById("t_m").innerHTML.charAt(0)
// 				+ document.getElementById("t_m").innerHTML.charAt(1);
// 		var second = document.getElementById("t_s").innerHTML.charAt(0)
// 				+ document.getElementById("t_s").innerHTML.charAt(1);

// 		var t = (hour * 3600) + (minute * 60) + (second * 1) - 1;
// 		if (t <= 0) {
// 			document.getElementById("t_h").innerHTML = "已";
// 			document.getElementById("t_m").innerHTML = "结";
// 			document.getElementById("t_s").innerHTML = "束";
// 		} else {
// 			var h = Math.floor(t / 60 / 60 % 24);
// 			var m = Math.floor(t / 60 % 60);
// 			var s = Math.floor(t % 60);

// 			document.getElementById("t_h").innerHTML = h + "时";
// 			if (m < 10) {
// 				m = "0" + m;
// 			}
// 			if (s < 10) {
// 				s = "0" + s;
// 			}
// 			document.getElementById("t_m").innerHTML = m + "分";
// 			document.getElementById("t_s").innerHTML = s + "秒";
// 		}
// 	}

	})

	function ajaxCall(method, url, callBackFunction, date) {

		var httprequest = new XMLHttpRequest();
		httprequest.onreadystatechange = function() {
			if (httprequest.readyState == 4 && httprequest.status == 200) {
				callBackFunction(httprequest.responseText);
			}
		}
		httprequest.open(method, url, false);
		httprequest.setRequestHeader("X-Requested-With", "AJAX");
		httprequest.send(document.getElementById("operation").value);
	}

// 	function clickStart() {
// 		document.getElementById("operation").value = "judge";
// 		ajaxCall("Post", "../SelfExamTransationServlet", judge);
// 	}

// 	function judge(result) {
// 		if ("无法开始竞赛" == result) {
// 			alert(result);
// 		} else {
// 			document.getElementById("div1").style.display = "none";
// 			document.getElementById("div2").style.display = "block";
// 			var obj = JSON.parse(result);
// 			var count = obj.countdown;
// 			strs = count.split("_");
// 			document.getElementById("t_h").innerHTML = strs[0];
// 			document.getElementById("t_m").innerHTML = strs[1];
// 			document.getElementById("t_s").innerHTML = strs[2];
// 			setInterval(refreshCount, 1000);
// 			var qstContent = obj.qstContent;
// 			document.getElementById("tarea1").value = qstContent;

// 		}
// 	}

// 	function refreshCount() {
// 		if (document.getElementById("t_h").innerHTML == "已") {
// 			return;
// 		}
// 		var hour = document.getElementById("t_h").innerHTML.charAt(0);
// 		var minute = document.getElementById("t_m").innerHTML.charAt(0)
// 				+ document.getElementById("t_m").innerHTML.charAt(1);
// 		var second = document.getElementById("t_s").innerHTML.charAt(0)
// 				+ document.getElementById("t_s").innerHTML.charAt(1);

// 		var t = (hour * 3600) + (minute * 60) + (second * 1) - 1;
// 		if (t <= 0) {
// 			document.getElementById("t_h").innerHTML = "已";
// 			document.getElementById("t_m").innerHTML = "结";
// 			document.getElementById("t_s").innerHTML = "束";
// 		} else {
// 			var h = Math.floor(t / 60 / 60 % 24);
// 			var m = Math.floor(t / 60 % 60);
// 			var s = Math.floor(t % 60);

// 			document.getElementById("t_h").innerHTML = h + "时";
// 			if (m < 10) {
// 				m = "0" + m;
// 			}
// 			if (s < 10) {
// 				s = "0" + s;
// 			}
// 			document.getElementById("t_m").innerHTML = m + "分";
// 			document.getElementById("t_s").innerHTML = s + "秒";
// 		}
// 	}

	

// 	function submit1() {
// 		document.getElementById("operation").value = "updateTotalTime";
// 		ajaxCall("Post", "../SelfExamTransationServlet", updateTotalTime);
// 		if (flag == 1) {
// 			return;
// 		}
// 		document.getElementById("form1").submit();
// 	}

	

	
<%-- <%User user = (User) request.getSession().getAttribute("user"); --%>
<%-- 			String img = (String) user.getImg();%> --%>
	
</script>
<body>

	<div id="wrapper">
		<nav class="navbar navbar-default navbar-cls-top " role="navigation"
			style="margin-bottom: 0">
			<div class="navbar-header">
				<!--                 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse"> -->
				<!--                     <span class="sr-only">Toggle navigation</span> -->
				<!--                     <span class="icon-bar"></span> -->
				<!--                     <span class="icon-bar"></span> -->
				<!--                     <span class="icon-bar"></span> -->
				<!--                 </button> -->
				<a class="navbar-brand">自在天原</a>
			</div>
			<div
				style="color: white; padding: 15px 50px 5px 50px; float: right; font-size: 16px;">
				<form action="../loginOut.jsp" method="post">
					<button type="submit" class="btn btn-danger">注销</button>
				</form>
			</div>
		</nav>
		<!-- /. NAV TOP  -->
		<nav class="navbar-default navbar-side" role="navigation">
			<div class="sidebar-collapse">
				<ul class="nav" id="main-menu">
					<%-- 					<li class="text-center"><img src="<%=img%>" --%>
					<!-- 						class="user-image img-responsive" /></li> -->
					<li class="text-center"><img src=""
						class="user-image img-responsive" /></li>

					<li><a href="../StudentPageSkip/index"><i
							class="fa fa-dashboard fa-3x"></i> 主页</a></li>
					<li><a href="../StudentPageSkip/UserInfo"><i
							class="fa fa-table fa-3x"></i> 个人信息</a></li>
					<li><a href="../StudentPageSkip/SelfExam"><i
							class="fa fa-desktop fa-3x"></i> 今日竞赛</a></li>
					<li><a href="../StudentPageSkip/TeamExam"><i
							class="fa fa-qrcode fa-3x"></i> 今日结对</a></li>
					<li><a href="../StudentPageSkip/History"><i
							class="fa fa-bar-chart-o fa-3x"></i> 历史记录</a></li>

					<li><a href="../StudentPageSkip/ChangePassword"><i
							class="fa fa-edit fa-3x"></i> 密码修改 </a></li>


				</ul>

			</div>

		</nav>
		<!-- /. NAV SIDE  -->
		<div id="page-wrapper">
			<div id="page-inner">
				<div class="row">
					<div class="col-md-12">
						<h2>学员今日竞赛</h2>
					</div>
				</div>
				<!-- /. ROW  -->
				<hr />

				<div class="col-sm-offset-10 col-sm-2">
					<input id="date" style="background: transparent; border: none;"
						disabled="true"font-size:50px;"></input>
				</div>

				<div>
					<input id="operation" style="display: none;"></input>
				</div>
				<div id="div1"
					style="position: absolute; left: 50%; margin-left: -30px; top: 50%; margin-top: -30px;">
					<button id="start" type="button" class="btn btn-default btn-lg"
						style="height: 150px; width: 300px; font-size: 50px">
						<span class="glyphicon glyphicon-hand-right"></span> Start
					</button>

				</div>

				<div id="div2" style="display: none">
					<div class="col-sm-offset-0 col-sm-12">
						<h1>
							<span class="label label-info">今日竞赛</span>
						</h1>
						<br />
						<textarea id="tarea1" rows="20" cols="120"
							style="background: transparent" disabled="true"></textarea>
					</div>

					<div class="col-sm-offset-0 col-sm-12">
						<!-- 						<h3> -->
						<!-- 							<span class="label label-warning">距离结束还有: <span id="t_h"><input></span> -->
						<!-- 								<span id="t_m">.</span> <span id="t_s">.</span> -->
						<!-- 							</span> -->
						<!-- 						</h3> -->
						<h1>倒计时</h1>
						<div class="time-item">
							<span id="day_show">0天</span> <strong id="hour_show">0时</strong>
							<strong id="minute_show">0分</strong> <strong id="second_show">0秒</strong>
						</div>
					</div>

					<form id="form1" action="../SelfExamTransation/submit"
						method="post" enctype="multipart/form-data">
						<div class="col-sm-offset-6 col-sm-6">
							<h3>
								<font face="隶书" color="	">作业提交</font>
							</h3>
							<input type="file" id="inputfile" name="fileName" accept=".zip"><br />
							<input type="submit" class="btn btn-success" value="请选择文件" name="submit"
								id="b1" disabled="disabled" onclick="submit1()"><br />
							<font color="#FF0000">Tip1:仅可提交一次，无法重复提交！</font><br /> <font
								color="#FF0000">Tip2:仅可提交zip文件!</font>
						</div>
					</form>

				</div>
			</div>
		</div>
		<!-- /. PAGE INNER  -->
	</div>
	<!-- /. PAGE WRAPPER  -->

	<!-- /. WRAPPER  -->
	<!-- SCRIPTS -AT THE BOTOM TO REDUCE THE LOAD TIME-->
	<!-- JQUERY SCRIPTS -->
	<script src="../js/jquery-1.10.2.js"></script>
	<!-- BOOTSTRAP SCRIPTS -->
	<script src="../js/bootstrap.min.js"></script>
	<!-- METISMENU SCRIPTS -->
	<script src="../js/jquery.metisMenu.js"></script>



</body>
</html>
